<!-- Create Modal -->
<div class="modal fade" id="createModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
  <div class="modal-dialog">
    <div class="modal-content panel panel-warning">
      <div class="modal-header panel-heading">
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true"><span class="label label-danger"> &times;</span></button>
        <h4 class="modal-title panel-title">Create new</h4>
      </div>
      <div class="modal-body">

        <form role="form" id="form-create" action="<?php echo base_url(); ?>/index.php/Category_controller/create" method="post" accept-charset="utf-8">

          <div class="form-group">
            <label for="categoryid">CategoryId:</label>
            <input type="text" name="categoryid" id="createId" class="form-control" />
            <span class="help-block"></span>
          </div>

          <div class="form-group">
            <label for="categoryid">Name:</label>
            <input type="text" name="categoryname" id="createName" class="form-control" />
            <span class="help-block"></span>
          </div>

        </form>

      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
        <button type="submit" id="submit-create" class="btn btn-primary">Create news category</button>
      </div>
    </div><!-- /.modal-content -->
  </div><!-- /.modal-dialog -->
</div><!-- /.modal -->


<script type="text/javascript">
     /*Form */
   $('.btn-create').click(function()
    {

      // btn-edit click
      $('#submit-create').click(function(event) 
      {
        // set action for form edit
        // submit form
        $('#form-create').submit();
      });
    });

</script>  

<script type="text/javascript">

  $(document).ready(function () {

    var Categoryid = $("#createId");
    var Categoryname = $("#createName");

    var CreateForm = $('#form-create');
    var SubmitBtn = $('#submit-create');

    CreateForm.validate();

    Categoryid.rules("add", {
      required: true,
      rangelength: [3, 20],
      messages: {
        required: "You must provide your username.",
        rangelength: "The user name must be between 3 and 20 characters in length."
      }
    });

    Categoryname.rules("add", {
      required: true,
      messages: {
        required: "You must provide your password."
      }
    });

$('#submit-create').submit(function () {
  if ($(this).valid()) {
    $('#SubmitBtn').prop('disabled', true);
    return true;
  }
  return false;
});

});

</script>

